<template>
	<view class="think-adopt">
		<u-navbar title-color="#000" :isBack="true" back-icon-color="#000" height="60" :title="pageTitle">
			<view class="navbar-right" slot="right" @click="submit">
				<view class="message-box right-item">
					提交
				</view>
			</view>
		</u-navbar>
		<u-form>
			<u-form-item>
				<u-input height="90" placeholder="请输入标题" v-model="info.infoTitle" type="text" :border="true"></u-input>
			</u-form-item>
			<u-input type="textarea" placeholder="请填写简介" v-model="info.infoComm" height="300" :border="false" />
			<u-upload @on-list-change="onListChange" width="160" height="160" :max-count="9" :action="pathurl"></u-upload>
			<u-form-item padding="0upx 20upx">
				<view class="wrap-item">
					<image src="../../static/img/定位.png" class="img"></image>
					<text class="info color">{{get_address}}</text>
				</view>
			</u-form-item>
		</u-form>
		<footer-btn></footer-btn>
	</view>
</template>

<script>
	import footerBtn from '../../components/footer-btn.vue';
	export default {
		components: {
			footerBtn
		},
		data() {
			return {
				type: 1,
				pageTitle: '',
				info: {
					infoTitle: '',
					infoComm: '',
					infoImgList: []
				},
				pathurl: this.$url.serverUrl,
				selectList: [],
			};
		},
		onLoad(options) {
			if (options && options.type) {
				this.type = parseInt(options.type);
				this.pageTitle = ['发布领养', '我想领养', '寻宠启示', '宠物二三事'][this.type]
				console.log(this.type)
			}
		},
		methods: {
			onListChange(lists) {
				this.info.infoImgList = lists
			},
			submit() {
				let info = JSON.parse(JSON.stringify(this.info))
				info.infoImgList = info.infoImgList.map(item => {
					if (item.response.code) {
						return item.response.url
					}
				})
				info.infoAddress = this.get_address
				let valLoginRes = this.$validate.validate(info, [{
						name: 'infoTitle',
						type: 'required',
						errmsg: '标题不能为空'
					},
					{
						name: 'infoComm',
						type: 'required',
						errmsg: '内容不能为空'
					},
					{
						name: 'infoImgList',
						type: 'arrlength',
						errmsg: '图片不能为空'
					}
				])
				if (!valLoginRes.isOk) {
					this.$comm.errorToShow(valLoginRes.errmsg)
					return false
				}
				this.$api.addInfo({
					...info,
					infoType: this.type
				}).then(res => {
					if (res.code == 1) {
						this.$comm.successToShow(res.msg, () => {
							this.$comm.switchTabTo('/pages/index/index')
						})
					} else if (res.code == 444) {
						this.$comm.errorToShow(res.msg)
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #FFFFFF;
		min-height: 100vh;
	}

	.wrap-item {
		display: flex;
		align-items: center;

		.img {
			width: 40upx;
			height: 40upx;
		}

		.info {
			margin-left: 35upx;
			font-size: 24upx;

			&.color {
				color: $tabAction;
			}
		}
	}

	.think-adopt {
		background-color: #FFFFFF;

		.navbar-right {
			margin-right: 24rpx;
			display: flex;
		}

		.right-item {
			margin: 0 12rpx;
			position: relative;
			display: flex;
		}

		.message-box {
			padding: 6upx 24upx;
			font-size: 24upx;
			background-color: $indexColor;
			color: #FFFFFF;
			border-radius: 12upx;
		}
	}
</style>
